<template>
  <div class="about">
    <h1>{{ name }}</h1>
    <a-button @click="connect">连接</a-button>
    <a-button @click="subscribe">接收</a-button>
    <a-button @click="send">发送</a-button>
  </div>
</template>
<script lang="ts">
import { defineComponent, inject } from 'vue'
import TrackerService from '@/service/ws/tracker.service'

export default defineComponent({
  name: 'About',
  setup() {
    const name = '邮电大学1'
    const trackerService: TrackerService | undefined = inject('trackerService')
    function connect() {
      return trackerService!.connect()
    }
    function subscribe() {
      return trackerService!.subscribe()
    }
    function send() {
      return trackerService!.send()
    }
    return {
      name,
      connect,
      subscribe,
      send
    }
  }
})
</script>
